<template>
  <div>
    <!--  1.用户信息-->
    <div class="dv1">
      <van-row justify="center" align="center">
        <van-col offset="1" span="6">
          <van-image
              round
              style="margin-top: 1rem"
              width="4rem"
              height="4rem"
              src="https://cdn.jsdelivr.net/npm/@vant/assets/cat.jpeg"
          />
        </van-col>
        <van-col span="8">
          <van-button v-if="this.$store.state.token.length==0" type="success" @click="tzLogin()">登录账号</van-button>
          <label v-else>{{this.$store.state.user.phone}}</label>
        </van-col>
      </van-row>
    </div>
    <!--  2.功能-->
    <div>
      <van-divider content-position="left"
                   :style="{ borderColor: '#1989fa' }"
      >
        个人中心
      </van-divider>
      <van-grid :border="false" gutter="10" ro>
        <van-grid-item icon="photo-o" icon-color="red" text="收获地址" />
        <van-grid-item icon="photo-o" icon-color="red" text="我的订单" to="/orderlist" />
        <van-grid-item icon="photo-o" icon-color="red" text="购物车" to="/cart"/>
        <van-grid-item icon="photo-o" icon-color="red" text="系统通知" />
        <van-grid-item icon="photo-o" icon-color="red" text="我的足迹" />
        <van-grid-item icon="photo-o" icon-color="red" text="我的试用" />
        <van-grid-item icon="photo-o" icon-color="red" text="讲座预约" to="/applylist" />
      </van-grid>
    </div>
    <!--  3.工具菜单-->
    <div>

      <van-cell-group title="系统设置">
        <van-cell title="账号与安全" is-link url="https://github.com" />
        <van-cell title="帮助反馈" is-link to="index" />
        <van-cell title="消息通知" is-link to="index" />
        <van-cell title="隐私" is-link to="index" />
        <van-cell title="通用" is-link to="index" />
        <van-cell title="关于我们" is-link to="index" />
        <van-cell title="检测版本" is-link to="index" />
        <van-button type="primary" block>注销账号</van-button>
      </van-cell-group>
    </div>
  </div>
</template>

<script>
export default {
  name: "My",
  data(){
    return{
      user:{
        phone:"111",
        password:"2222",
        flag:1
      }
    }
  },
  methods:{
    tzLogin(){
      this.$router.push("/phoneLogin");
    }
  }
}
</script>

<style scoped>
.dv1{
  height: 6rem;
  background-color: antiquewhite;
}
</style>